<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
 <%@ taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0;user-scalable=0;" />
<title>填写订单</title>
<script src="<s:url value="/admin/jquery.mobile/jquery-1.9.1.min.js"/>"></script>
<link href="<s:url value='/admin/jquery.mobile/jquery.mobile-1.4.2.min.css' />" rel="stylesheet" type="text/css"/>
<script type="text/javascript">
$(document).ready(function() {
	$("input[type='text']").attr("onfocus", "checkFocusUi(this)");
});

function checkFocusUi(el) {
    $("input[type='text']").each(function(index,input){
        $(input).parent().removeClass("ui-focus");
    });
    $(el).parent().addClass("ui-focus");
}

function selectTime(el) {
	$(el).prev().html($("#select-native-1").val());
	$("#timeTemplateField").val($("#select-native-1").val());
}


function submitForm() {
	var pickupName = $("#pickupName");
	if(pickupName.val() == "") {
		alert("请填写您正确的姓名！");
		pickupName.focus();
		return;
	}
	var pickupPhone = $("#pickupPhone");
	if(pickupPhone.val() == "") {
		alert("请填写您正确的联系方式！");
		pickupPhone.focus();
		return;
	}
	var pickupAddress = $("#pickupAddress");
	if(pickupAddress.val() == "") {
		alert("请填写您地址，以便我们上门取件！");
		pickupAddress.focus();
		return;
	}
	if($("#timeTemplateField").val() == "选择时间段" || $("#timeTemplateField").val() == "") {
		alert("请选择时间段！");
		return;
	}
	$("#piclkupForm").submit();
}
</script>
</head>
<body>
	<div class="ui-page ui-page-theme-a ui-page-header-fixed ui-page-active" data-role="page" tabindex="0" style="padding-top: 45px; min-height: 347px; display: block;">
		<div class="ui-header ui-bar-b ui-header-fixed slidedown" role="banner" data-role="header">
		    <h1 aria-level="1" role="heading" class="ui-title">填写订单</h1>
		    <a role="button" data-role="button" class="ui-link ui-btn-left ui-btn ui-icon-carat-l ui-btn-icon-notext ui-shadow ui-corner-all" data-iconpos="notext" data-icon="carat-l" data-rel="back" href="#demo-intro">Back</a>
		    <a role="button" data-role="button" class="ui-link ui-btn-right ui-btn ui-icon-back ui-btn-icon-notext ui-shadow ui-corner-all" data-iconpos="notext" data-icon="back" onclick="window.location.reload()" href="#">Refresh</a>
		</div>
		<s:form id="piclkupForm" action="save" namespace="/pickup" method="post">
		
		<div class="ui-field-contain" >
			<label for="textinput-fc">姓名:</label>
			<div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset">
				<input type="text" value="" placeholder="姓名" id="pickupName" name="pickup.name">
			</div>
		</div>
		<div class="ui-field-contain" >
			<label for="textinput-fc">电话:</label>
			<div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset">
				<input type="text" name="pickup.phone" id="pickupPhone" class="ui-icon-phone" placeholder="电话" value="" maxlength="11">
			</div>
		</div>
		<div class="ui-field-contain">
            <label for="select-native-1">上门收件时间:</label>
            <div class="ui-select">
	            <div id="select-native-1-button" class="ui-btn ui-icon-carat-d ui-btn-icon-right ui-corner-all ui-shadow">
	            	<s:hidden id="timeTemplateField" name="pickup.time"/>
	            	<span>选择时间段</span>
	            	<select name="select-native-1" id="select-native-1" onchange="selectTime(this)" >
	            		<option value="选择时间段" disabled="disabled" selected="selected">选择时间段</option>
	            	<s:iterator value="templates">
	            		<option value="<s:property value="name"/>"><s:property value="name"/></option>
	            	</s:iterator>
	            </select>
	            </div>
            </div>
        </div>
		<div class="ui-field-contain">
			<label for="textinput-fc">地址:</label>
			<div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset">
				<input type="text" name="pickup.address" id="pickupAddress" class="ui-icon-location" placeholder="学校+宿舍区+宿舍号" value="" maxlength="30">
			</div>
		</div>
		<div class="ui-field-contain">
			<label for="textinput-fc">重量KG:</label>
			<div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset">
				<input type="text" name="pickup.weight" id="pickupWeight" value="1" maxlength="4" >
			</div>
		</div>
		<div class="ui-field-contain">
			<label for="textinput-fc">备注:</label>
			<div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset">
				<input type="text" name="pickup.description" id="pickupDescription" class="ui-icon-location" placeholder="请填入要寄件的快递公司及物品，例如：韵达+手机" value="" maxlength="30" >
			</div>
		</div>
		<div style="margin-top: 40px;">
			<button class="ui-btn ui-corner-all ui-shadow ui-icon-check ui-btn-icon-left ui-btn-a ui-btn-active" type="button" id="submit-2" onclick="submitForm()" >提交订单</button>
		</div>
		</s:form>
	</div>
</body>
</html>